<template>
	<basic-container>
		<ve-histogram ref="chart1" height="400px" :data="chartData1" :extend="extend"></ve-histogram>
	</basic-container>
</template>

<script>
	import request from '@/router/axios';
	import {
		getCodes
	} from "@/api/system/dict";
	import VeHistogram from 'v-charts/lib/histogram.common'

	export default {
		components: {
			VeHistogram
		},
		data() {
			return {
				extend: {
					series: {
						label: {
							show: true,
							position: 'top'
						}
					},
					xAxis: {
						axisLabel: {
							interval: 0,
							rotate: 20
						}
					}
				},
				chartData1: {
					columns: ['类别', '库存数量'],
					rows: []
				}
			};
		},
		created() {
			getCodes('f12c0b0a-a7d7-43c8-b0a2-d9df66067c67').then(res => {
				res.data.data.forEach(m => {
					this.chartData1.rows.push({
						'类别': m.name,
						'库存数量': Math.floor(Math.random() * 10 + 1)
					})
				})
				// this.$nextTick(_ => {
				// 	this.$refs['chart1'].echarts.resize()
				// })
			});
		},
		mounted() {

		},
		methods: {}
	};
</script>

<style>
</style>
